<template>
	<div>
		<div class="circular" :style="backClass"></div>
		<div class="cellbox-tis">活期</div>
		<div class="cellheight-left">人民币</div>
		<div class="cellheight-center">100,1000,000.00</div>
		<div class="cellheight-right"><van-icon name="arrow" /></div>
	</div>
</template>

<script>
	import { Icon } from 'vant';
	export default{
		 props:{
			 bjClass:{
				 type:String,
				 default:'#0083C8'
			 }
		 },
		components: {
			[Icon.name]:Icon,
		},
		computed:{
			backClass(){
				return this.bjClass ? {backgroundColor:this.bjClass}:{}
			}
		}
	}
</script>

<style lang="less" scoped>
	.circular{
		width: 22px;
		height: 22px;
		// background-color: #0083C8;
		margin-right: 12px;
		border-radius: 50%;
	}
	.cellbox-tis{
		font-size: 20px;
		color: #101010;
	}
	.cellheight-left{
			font-size: 16px;
			flex: 2;
			
		}
		.cellheight-center{
			font-size: 18px;
			flex: 5;
			text-align: right;
		}
		.cellheight-right{
			font-size: 15px;
			color: #CECECE;
			flex: 1;
		}
</style>
